<template>
  <div class="home">
    <p>追梦人</p>
    <button @click="onclick()">接口1测试</button>
    <div class="content" v-for="(item,index) in list" :key="index">
      <p>{{ item.title }}</p>
    </div>
    <button @click="click2()">接口2测试</button>
    <div v-for="(item,index) in titleList" :key="index">
      <p> {{item}} </p>
    </div>
    <button @click="click3()">接口3测试</button>
    <!-- <div v-for="(item,index) in titleList" :key="index">
      <p> {{item}} </p>
    </div> -->
  </div>
</template>
<script>
export default {
  name: 'Home',
  components: {
    // HelloWorld
  },
  data() {
    return {
      list: [],
      titleList:[]
    }
  },
  methods: {
    async onclick() {
      const res = await this.$axios.post('/city/api')
      this.list = res.data.citys
    },
    async click2() {
      const res = await this.$axios.post('/title/api')
      this.titleList = res.data
    },
    async click3() {
      const res = await this.$axios.get('/detail/api')
      console.log(res.data,789)
    }
  }
}
</script>
<style lang="less">
.content {
  background-color: azure;
}
</style>
